<template>
  <div id="app">
    11111111==={{this.$store.state.msg}}===={{app}}==={{msg}}==={{two}}
    <!-- <router-view /> -->
    <hr />
    <a1></a1>
    <hr />
    <a2></a2>
    <hr />
    <list></list>
  </div>
</template>

<script>
// 方式一
import a1 from "@/family/a1.vue";
import a2 from "@/family/a2.vue";
import list from "@/components/list.vue";
// 方式二  按需导入
import { mapState } from "vuex";
export default {
  data() {
    return {
      app: this.$store.state.msg,
    };
  },
  created() {
    console.log(this, 1111);
  },
  computed: {
    // 映射
    // ...展开运算符把对象里面的方法拿出来，在该方法里传参（store里面的数据）
    // 参数必须是数组
    ...mapState(["msg", "two"]),
  },
  components: {
    a1,
    a2,
    list,
  },
};
</script>
<style lang="less">
</style>
